import React from 'react';
import { Button, Result } from 'antd';
import { HomeOutlined } from '@ant-design/icons';
import { useNavigate } from 'react-router-dom';
import './index.scss';

/**
 * 404页面组件
 * 显示页面未找到的提示信息，并提供返回首页的按钮
 */
const NotFound: React.FC = () => {
  const navigate = useNavigate();

  const handleGoHome = () => {
    navigate('/');
  };

  return (
    <Result
        status="404"
        title="404"
        subTitle="抱歉，您访问的页面不存在或已被移除"
        extra={
          <Button
            type="primary"
            icon={<HomeOutlined />}
            onClick={handleGoHome}
          >
            返回首页
          </Button>
        }
      />
  );
};

export default NotFound;